.layout-box {
  padding-top: 1.32rem /* 99/75 */;
}
.mm-header {
  background-color: #f4483e;
}
.mm-header h4 {
  font-size: 0.466667rem /* 35/75 */;
  line-height: 1.32rem;
  text-align: center;
  color: #fff;
}
.mm-header .mm-app {
  position: absolute;
  top: 0.066667rem /* 5/75 */;
  right: 0.066667rem /* 5/75 */;
}
.mm-header .mm-back {
  width: 0.613333rem /* 46/75 */;
  height: 0.613333rem /* 46/75 */;
  position: absolute;
  left: 0.4rem /* 30/75 */;
  top: 0.353333rem /* 26.5/75 */;
  font-size: 0.6rem /* 45/75 */;
  color: #fff;
}
.mm-product {
  position: relative;
}
.mm-product .item {
  width: 100%;
  height: 3.413333rem /* 256/75 */;
  border-bottom: 0.026667rem /* 2/75 */ solid #f1f1f1;
  padding: 0.266667rem /* 20/75 */ 0;
}
.mm-product .item .pro-left {
  width: 30%;
  height: 100%;
  text-align: center;
}
.mm-product .item .pro-left img {
  width: 2.666667rem;
  height: 2.666667rem;
  line-height: 100%;
}
.mm-product .item .pro-right {
  width: 70%;
  position: relative;
}
.mm-product .item .pro-right span {
  font-size: .32rem;
}
.mm-product .item .pro-right .out {
  text-overflow: -o-ellipsis-lastline;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
}
.mm-product .item .pro-right .in {
  color: #ff761a;
}
.mm-product .item .pro-right p {
  position: absolute;
  left: 0;
  font-size: 0.186667rem /* 14/75 */;
}
.mm-product .item .pro-right p span {
  font-size: 0.186667rem /* 14/75 */;
}
.mm-product .item .pro-right .base {
  margin-top: 1.666667rem /* 50/75 */;
}
.mm-product .item .pro-right .base .right {
  font-size: 0.16rem /* 12/75 */;
  margin-right: 0.266667rem /* 20/75 */;
}
.mm-product .item .pro-right .arrow {
  position: absolute;
  right: 0.2rem /* 15/75 */;
  bottom: 1.066667rem /* 80/75 */;
}
.mm-product .item .pro-right .arrow span {
  font-size: 0.533333rem /* 40/75 */;
  color: #ccc;
}
.mm-product .item {
  display: block;
}
.modal {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.4);
  width: 100%;
  height: 100%;
}
.modal .content {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 10;
  transform: translate(-50%, -50%);
  height: 5.333333rem /* 400/75 */;
  width: 5.333333rem /* 400/75 */;
  background-color: #eee;
}
.modal .content .img {
  position: absolute;
  overflow: hidden;
}
.modal .content .img li {
  height: 5.333333rem /* 400/75 */;
  width: 5.333333rem /* 400/75 */;
}
.modal .content .img li img {
  height: 5.333333rem /* 400/75 */;
  width: 5.333333rem /* 400/75 */;
}
.modal .content .prev,
.modal .content .next {
  position: absolute;
  top: 50%;
  left: -60px;
}
.modal .content .prev span,
.modal .content .next span {
  font-size: 1.066667rem /* 80/75 */;
  color: #fff;
  font-family: '楷体';
}
.modal .content .next {
  left: auto;
  top: 2.5rem /* 90/75 */;
  right: -75px;
}
.modal .content .next span {
  font-size: 1.2rem /* 90/75 */;
}
